<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	
	<script src="js/jquery-1.10.2.js"></script>
	<script src="js/jquery-ui-1.10.3.js"></script>
  	<script src="js/bootstrap.js"></script>
		
    <!-- Le styles -->
    <link href="css/bootstrap.css" rel="stylesheet">    
    <link href="css/bootstrap-responsive.css" rel="stylesheet">
	<link href="css/bootswatch.css" rel="stylesheet">
    <link href="css/jquery-ui-1.10.3.css" rel="stylesheet">
    
	<title>Karaoke</title>
</head>
<body>

			<!-- INICIO DEL MENU PRINCIPAL -->
	    <div class="navbar navbar-inverse navbar-fixed-top">
	      <div class="navbar-inner">
	        <div class="container">
	          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
	            <span class="icon-bar"></span>
	            <span class="icon-bar"></span>
	            <span class="icon-bar"></span>
	          </a>
	          <a class="brand" href="#">Karaoke</a>
	          <div class="nav-collapse collapse">
			            <ul class="nav">
		              <li class="active"><a href="#">Home</a></li>
		              <li><a href="ReservaBuscar.jsp">Reservas</a></li>
		              <li><a href="ProductoBuscar.jsp">Productos</a></li>
		              <li><a href="LocalBuscar.jsp">Locales</a></li>
		              <li><a href="SalaBuscar.jsp">Salas</a></li>
		              <li><a href="EventoBuscar.jsp">Eventos</a></li>
		              <li><a href="ComprobanteBuscar.jsp">Comprobante</a></li>
	            </ul>
	          </div>
	        </div>
	      </div>
	    </div>
		<!-- FIN DEL MENU PRINCIPAL -->
		
	<div>
	
	<fieldset class="form-horizontal well">
	  <p>Comprobantes de Pago </p>
	</fieldset>
		
	<fieldset class="form-horizontal well">
		<form id="form2" name="form2" method="post" action=ComprobanteServlet?Param=nuevo>
		    <button id="button" type="submit" class="btn btn-primary">Nuevo</button>		
		</form>
	</fieldset>
	
	<fieldset class="form-horizontal well">
		
		<form id="form1" name="form1" method="post" action="ComprobanteServlet?Param=buscar">
		    <button id="button" type="submit" class="btn btn-primary">Buscar</button>		
		</form>
		
		<table class="table table-striped table-bordered">
		  <tr>
		    <th width="40" scope="col">Item</th>
		    <th width="40" scope="col">Fecha</th>
		    <th width="40" scope="col">Monto</th>
		  </tr>
		
		<%@page import="java.util.*, pe.edu.upc.karaoke.modelo.*" %>
		<%
		List<Comprobante> listaComprobante = (ArrayList<Comprobante>)request.getAttribute("comprobantes");
		if(listaComprobante != null) { 
		int i = 1;
		for(Comprobante x : listaComprobante) {
		%>  
		  <tr>
		    <td><%= i++ %></td>
		    <td><% out.print(x.getFecha()); %></td>
		    <td><% out.print(x.getMonto()); %></td>

		  </tr>
		<% }  
		  } %>
		  
		</table>
	</fieldset>
  <div>
</body>
</html>